@use "../../common.scss";

.playlists_table {
    border-collapse: separate;
    width: 100%;

    tbody {
        &.body_dragged_over {
            background: common.$bgdark;
        }
    }

    tr {
        color: common.$white;
        user-select: none;
        background: rgba(common.$background2, 0.5);
    }

    td {
        @include common.ellipsis;
        padding: 0 1em;
    }

    .thumbnail_cell {
        height: 4em;
        width: 4em;
        padding: 0;
    }

    .thumbnail {
        display: block;
        width: 4em;
        height: 4em;
        object-fit: contain;
    }

    .modification_date_cell_content {
        display: flex;
        flex-flow: row;
        justify-content: flex-end;
        text-align: right;

        .modified_dates {
            display: flex;
            flex-flow: column;
        }
    }

    .sync_cell {
        width: 0;
    }

    .sync_cell_content {
        display: flex;
        flex: 1 1 auto;
        justify-content: center;
        align-items: center;
    }
}
